.navbar
  .navbar-inner
    .left.sliding
      a(href="index.html").back.link
        i.icon.icon-back
        span Back
    .center.sliding Calendar Timeline
    .right
      a(href="#").link.open-panel.icon-only
        i.icon.icon-bars
.pages.navbar-through
  .page(data-page="timeline-calendar")
    .page-content
      .timeline.timeline-horizontal.col-33.tablet-15
        .timeline-year
          .timeline-year-title
            span 2016
          .timeline-month
            .timeline-month-title
              span December
            - for (var i = 20; i <= 31; i++)
              .timeline-item
                .timeline-item-date #{i}
                .timeline-item-content
                  - for (var j = 1; j <= Math.ceil(Math.random() * 5); j++)
                    .timeline-item-time #{Math.floor(Math.random()*24)}:00
                    .timeline-item-text Task #{j}
        .timeline-year
          .timeline-year-title
            span 2017
          .timeline-month
            .timeline-month-title
              span January
            - for (var i = 1; i <= 31; i++)
              .timeline-item
                .timeline-item-date #{i}
                .timeline-item-content
                  - for (var j = 1; j <= Math.ceil(Math.random() * 5); j++)
                    .timeline-item-time #{Math.floor(Math.random()*24)}:00
                    .timeline-item-text Task #{j}
          .timeline-month
            .timeline-month-title
              span February
            - for (var i = 1; i <= 28; i++)
              .timeline-item
                .timeline-item-date #{i}
                .timeline-item-content
                  - for (var j = 1; j <= Math.ceil(Math.random() * 5); j++)
                    .timeline-item-time #{Math.floor(Math.random()*24)}:00
                    .timeline-item-text Task #{j}